<!--
 * @Author: Lizhen
 * @Date: 2023-08-11
 * @LastEditors: Lizhen
 * @LastEditTime: 2023-08-17
 * @FilePath: /vite-project/src/views/HomeView.vue
 * @Description: 
-->
<template>
  <main>
    时间点: {{clockTime}}
    {{dayjs()}}
    <br>
    <br>
    <el-upload
      class="upload-demo"
      action="#"
      :auto-upload="false"
      :on-change="
        (file, fileList) => inCome(file, fileList)
      "
      :limit="1"
      :file-list="zjcfileList"
    >
      <el-button type="primary">点击上传</el-button>
    </el-upload>
    <el-button type="success" plain @click="onExport" >下载 <el-icon><Download /></el-icon></el-button>
--{{ fileName }}
    <el-divider></el-divider>
    <el-table :data="allData" id="table" style="width: 100%">
      <el-table-column prop="人员编号" label="编号">  </el-table-column>
      <el-table-column prop="姓名" label="姓名"> </el-table-column>
      <el-table-column prop="刷卡日期" label="刷卡日期"> </el-table-column>
      <el-table-column prop="星期" label="星期"> </el-table-column>
      <el-table-column label="上午上班">
        <template #default="{row}">
          {{ row.times[0] }}
        </template>
      </el-table-column>
      <el-table-column label="上午下班">
        <template #default="{row}">
          {{ row.times[1] }}
        </template>
      </el-table-column>
      <el-table-column label="下午上班">
        <template #default="{row}">
          {{ row.times[2] }}
        </template>
      </el-table-column>
      <el-table-column label="下午下班">
        <template #default="{row}">
          {{ row.times[3] }}
        </template>
      </el-table-column>
      <el-table-column prop="nullTimes" label="缺卡次数"> </el-table-column>
    </el-table>

  </main>
</template>
<script setup>
import { useTimesStore } from '@/stores/times'
import { reactive,ref } from 'vue'
import { dayjs } from 'element-plus'
import array from "lodash/array";

import FileSaver from "file-saver";
import * as XLSX from "xlsx";
import isBetween from 'dayjs/plugin/isBetween'
dayjs.extend(isBetween)
const today = dayjs().format("YYYY-MM-DD ")
const { timesArr } = useTimesStore()
let allData = ref([]) , clockArr = reactive([]);
const clockTime = [timesArr[0].workUp,timesArr[0].noonDown,timesArr[0].noonUp,timesArr[0].workDown]
// const clockTime = ['08:00', '12:00', '14:00', '18:30']
const testArr = ['07:30', '07:50', '08:10', '12:00', '13:30', '18:30']
let fileName = ref('')
const inCome = (file) => {
  fileName.value = file.name;
  let reader = new FileReader();
      reader.onload = (res) => {
        try {
          let data = res.target.result;
          let workbook = XLSX.read(data, {
            type: "binary",
          });
          let obj = Object.values(workbook.Sheets)[0];
          let list = XLSX.utils.sheet_to_json(obj);
          allData.value = list.map(item => {
            // 将list中的每一项转换成一个数组
            let allIn = []
            let tempArr = []
            // 字段名就叫1-10
            for (let index = 0; index < 10; index++) {
              // 将item中的每一项转换成字符串
              const whichCol = item[index + 1]?.trim()
              // 如果字符串不为空
              if(whichCol){
                allIn.push(whichCol)
              }
            }
            if(dayjs(today + allIn[0]).isBefore(today + clockTime[0], "minute")){
              tempArr[0] = allIn[0]
            }else tempArr[0] = null

            let middleTimes = allIn.filter((item,index) => {
              return dayjs(today + item).isBetween(today + clockTime[1],today + clockTime[2], "minute", '[]') 
            })
            // console.log(item.姓名,item.刷卡日期, middleTimes);
            switch(middleTimes.length){
              case 0:
                tempArr[1] = null
                tempArr[2] = null
                break;
              case 1:
                tempArr[1] = middleTimes[0]
                tempArr[2] = null
              case 2:
                // 用dayjs判断	middleTimes[0]和middleTimes[1]间隔是否有30分钟
                if(dayjs(today + middleTimes[1]).diff(today + middleTimes[0], 'minutes') >= 30){
                  // 间隔是否大于等于30
                  tempArr[1] = middleTimes[0]
                  tempArr[2] = middleTimes[1]
                }else {
                  tempArr[1] = middleTimes[0]
                  tempArr[2] = null
                }
                break;
              default:
                tempArr[1] = middleTimes[0]
                tempArr[2] = null
                if(dayjs(today + array.last(middleTimes)).diff(today + middleTimes[0], 'minutes') >= 30){
                  tempArr[2] = array.last(middleTimes)
                }
                break;  
            }

            if(dayjs(today + array.last(allIn) ).isAfter(today + clockTime[3], "minute")){
              tempArr[3] = array.last(allIn)
            }else tempArr[3] = null
            // 找出tempArr中null的个数
            item.nullTimes = tempArr.filter(item => item === null).length
            item.times = tempArr
            return item
          })
        }catch  (error) {
          console.log('error>>>', error);
        }
      }
      reader.readAsBinaryString(file.raw);
}
const onExport = () => {
  let wb = XLSX.utils.table_to_book(document.querySelector("#table"), { raw: true });
        // 获取table数据
        let wbout = XLSX.write(wb, {
          bookType: "xlsx",
          bookSST: true,
          type: "array",
        });
        try {
          // 生成文件
          FileSaver.saveAs(
            new Blob([wbout], { type: "application/octet-stream" }),fileName.value
          );
        } catch (e) {
          // 异常情况处理
          if (typeof console !== "undefined") console.log(e, wbout);
        }
        // 返回文件
        return wbout;
}
</script>


